<template>
    <Card>
        <div class="ChangeForm">
            <ActivatedCase
                :isSP="isSP"
                :getDataFn="getDataFn"
                :modal="modal"
                :contractBusiness="contractBusiness"
                :handleBusiness="'costExemptBill'"
                modalTitle="已激活案件列表"
                @closeModal="closeModal"
                @showContractDetial="showContractDetial"
                :dataDict="dataDict"
            />
            <Row>
                <Col span="24">
                    <Button type="primary" class="export-btn" @click="openModal">新增申请</Button>

                </Col>
                <Form ref="formInline" :model="formInline" :label-width="80" :rules="ruleInline">
                    <Col span="24">
                        <Row>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="申请编号" prop="applyNo">
                                    <Input clearable v-model="formInline.applyNo" placeholder="请输入"/>
                                </FormItem>
                            </Col>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="合同号" prop="contractNo">
                                    <Input clearable v-model="formInline.contractNo" placeholder="请输入"/>
                                </FormItem>
                            </Col>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="客户姓名" prop="clientName">
                                    <Input clearable v-model="formInline.clientName" placeholder="请输入"/>
                                </FormItem>
                            </Col>

                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">

                                <FormItem label="处理状态" prop="processStatus">
                                    <Select v-model="formInline.processStatus" placeholder="请选择" clearable>
                                        <Option v-for="(item,index) in dataDict.exemptProcessStatusDict" :key="index"
                                                :value="item.value">
                                            {{item.title}}
                                        </Option>
                                    </Select>
                                </FormItem>
                            </Col>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="申请时间" prop="applyDate">
                                    <DatePicker type="daterange" @on-change="selectstartDate" format="yyyy-MM-dd"
                                                placeholder="请选择" v-model="formInline.applyDates"></DatePicker>
                                </FormItem>
                            </Col>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="结束时间" prop="endDate">
                                    <DatePicker type="daterange" @on-change="selectEndDate" format="yyyy-MM-dd"
                                                placeholder="请选择" separator="到"
                                                v-model="formInline.endDates"></DatePicker>
                                </FormItem>
                            </Col>
                            <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                                <FormItem label="豁免单状态" prop="status">
                                    <Select v-model="formInline.status" placeholder="请选择" clearable>
                                        <Option v-for="(item,index)  in statusDict" :key="index" :value="item.value">
                                            {{item.title}}
                                        </Option>
                                    </Select>
                                </FormItem>
                            </Col>

                        </Row>
                    </Col>

                    <Col span="24">
                        <div class="contract-close-btns">
                            <Button type="primary" style="margin-right:16px" @click="handleSubmit()" icon="ios-search"
                            >搜索
                            </Button>
                            <Button type="primary" @click="handleReset('formInline')" icon="ios-trash-outline">重置</Button>
                        </div>
                    </Col>
                </Form>
            </Row>
            <Row>
                <Table :loading="loading" border :columns="columns" :data="data" width="100%" >
                    <!-- 处理状态 -->
                    <template slot-scope="{ row }" slot="processStatus">
                        <span>{{getTitle('exemptProcessStatus',row.processStatus )}}</span>
                    </template>
                    <!-- 状态 -->
                    <template slot-scope="{ row }" slot="costExemptBillStatus">
                        <span>{{getTitle2('costExemptBillStatus',row.status )}}</span>
                    </template>
                    <template slot-scope="{ row }" slot="action">
                        <!--
                            处理  isViewBtn ~~审核中 待补件 待补件审核~~
                            编辑 草稿
                            删除 草稿
                        -->
                        <Button :disabled="!row.isViewBtn" type="primary" size="small"
                                @click="showContractDetial(row)">处理
                        </Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="primary" size="small"
                                @click="showContractDetial(row)">编辑
                        </Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="error" size="small" @click="remove(row)">
                            删除
                        </Button>
                    </template>
                    <template slot="contractNo" slot-scope="{ row }">
                        <a @click="showContractDetial(row,'readOnly')">{{row.contractNo}}</a>
                    </template>
                </Table>
            </Row>

            <Row type="flex" justify="end" class="page">
                <Page :current="formInline.pageNumber" :total="total" :page-size="formInline.pageSize"
                      @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]"
                      size="small" show-total show-elevator show-sizer></Page>
            </Row>

        </div>

    </Card>
</template>
<script>
    import {getTitleFromDataDict} from "_p/basic/assets/contract/js/utils";
    import {delById, getBasicCostList, page} from "@/projects/basic/api/contract/cost-exempt-bill/index";
    import {getDictDataByType} from "_p/basic/api/admin/datadic";
    import ActivatedCase from "_p/basic/pages/contract/common/activated-case/index";
    import {mapGetters} from "vuex";
    import {getDictDataList} from "_p/basic/assets/contract/js/utils";
    import {businessSource, channelType,roleType} from "_p/basic/api/contract/channel-type/channel-type";
    export default {
        name: "CostExemptBill",
        components: {
            ActivatedCase
        },
        data() {
            return {
                isSP: false,
                pageNo: 1,
                contractBusiness: [
                    "costExemptBill",
                    "closeContract",
                    "costExempt",
                    "collectionRevoke",
                    "exemptTypes",
                ],
                loading: true,
                statusDict: [],
                data: [],
                formInline: {
                    applyNo: '',
                    contractNo: '',
                    clientName: '',
                    processStatus:'',
                    applyDate: '',
                    endDate: '',
                    pageNumber: 1,
                    pageSize: 10,
                    status: null,
                    applyDate:'',
                    endDate:'',
                    createBy:'',
                    allCase:'',
                    caseNo:'',
                },
                dicttArr: [
                    "businessSource",
                    "PersonRoleType",
                    "contractStatus",
                    "channelType",
                    "costExemptBillStatus",
                    "exemptProcessStatus",
                ],
                params:{
                    readOnly:'',
                },
                dataDict: {}, // 数据字典
                ruleInline: {},
                columns: [
                    {
                        title: "操作",
                        minWidth: 180,
                        slot: "action",
                        align: "center",
                        fixed: 'left'
                    },
                    {
                        title: "合同号",
                        key: "contractNo",
                        minWidth: 180,
                        align: "center",
                        fixed: 'left',
                        slot: "contractNo",
                    },
                    {
                        title: "申请编号",
                        key: "applyNo",
                        minWidth: 180,
                        align: "center",
                        fixed: 'left'
                    },

                    {
                        title: "处理状态",
                        key: "processStatus",
                        slot: "processStatus",
                        minWidth: 180,
                        align: "center",
                        fixed: 'left'
                    },
                    {
                        title: "客户姓名",
                        key: "clientName",
                        minWidth: 180,
                        align: "center",
                    },

                    {
                        title: "罚息金额",
                        key: "overdueAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "费用金额",
                        key: "costAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "豁免额最小值",
                        key: "minAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "豁免额最大值",
                        key: "maxAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "净逾期额",
                        key: "netOverdueAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "到期费用金额",
                        key: "expireCostAmt",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "申请人",
                        key: "createBy",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "申请时间",
                        key: "applyDate",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "结束时间",
                        key: "endDate",
                        minWidth: 180,
                        align: "center"
                    },
                    {
                        title: "豁免单状态",
                        key: "status",
                        minWidth: 180,
                        slot: "costExemptBillStatus",
                        align: "center"
                    },
                ],
                total: 0,
                modalTitle: "",
                modal: false
            };


        },
        computed: {
            ...mapGetters({
                userInfo: "userInfo",
                roleType: "roles",
            }),
            // 是否是合作商
            isSP: function () {
                return channelType(this.roleType)
                // return true;
            },
            getDataFn: function () {
                return getBasicCostList;
            }
        },
        created() {
            this.isSP = channelType(this.$route.meta.params);
            // businessSource 通过 roleType 获取 值: BUSINESS_PEOPLE / SP
            this.businessSource = businessSource(this.roleType);
        },
        mounted() {
            this.init();

        },
        activated() {
            this.init();
        },
        methods: {
            init() {
                this.isSP = channelType(this.$route.meta.params);
                this.getReadOnly();
                this.getList();
                this.getDictDataList();
                this.getDictDataByType();

            },

            getList() {
                this.loading = true;
                page(this.formInline).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data = res.data.records;
                        this.total = res.data.total;
                    }
                });
                console.log("this.data=" + this.data);
            },
            getReadOnly(){
                if (this.$refs[this.params.readOnly] !== undefined) {
                    this.$refs[this.params.readOnly].resetFields();
                }
            },
            getTitle(type, val) {
                let data = this.dataDict[type + "Dict"] || [];
                return getTitleFromDataDict(data, val);
            },
            getTitle2(type, val) {
                return getTitleFromDataDict(this.statusDict, val);
            },
            getDictDataList() {
                getDictDataList(this.dicttArr).then(res => {
                    console.log("getDictDataList(this.dicttArr)", res);
                    this.dataDict = res;
                    this.dataDict.exemptProcessStatusDict = res.exemptProcessStatusDict;
                    this.dataDict.statusDict = res.costExemptBillStatusDict;
                });
            },
            getDictDataByType(){
                getDictDataByType("costExemptBillStatus").then(res => {
                    console.log("=========");
                    if (res.code === "0000") {
                        this.statusDict = [].concat(res.data);
                        console.log(this.statusDict);
                    }
                })

            },
            remove(v) {
                this.$Modal.confirm({
                    title: "确认删除",
                    content: "您确认要删除单号 " + v.contractNo + " ?",
                    onOk: () => {
                        delById(v.id).then(res => {
                            if (res.code === "0000") {
                                this.$Message.success(res.msg);
                                this.getList();
                                this.$emit(
                                    "getList",
                                    Object.assign({})
                                );
                            }
                        });
                    }
                });
            },
            handleReset(name) {
                console.log("handleReset(name) ")
                this.$refs[name].resetFields();
                this.getList();
            },

            openModal() {
                this.modalTitle = "已激活案件列表";
                this.modal = true

            },
            changePageSize(v) {
                this.formInline.pageSize = v;
                this.getList();
            },
            changePage(v) {
                this.formInline.pageNumber = v;
                this.getList();
            },


            closeModal() {
                console.log('closeModal');
                this.modal = false;
            },
            selectstartDate(v) {
                if (v) {
                    this.formInline.startCreateDate = v[0];
                    this.formInline.endCreateDate = v[1];
                }
            },
            selectEndDate(v) {
                if (v) {
                    this.formInline.startFinishDate = v[0];
                    this.formInline.endFinishDate = v[1];
                }
            },
            handleSubmit() {
                this.formInline.pageNumber = 1;
                this.formInline.pageSize = 50;
                this.getList();
            },
            showContractDetial(params, type) {
                //  let id = params.contractNo ? params.contractNo : "0";
                // params.editFlag = false;
                if (type) params.readOnly = true;
                // if (type="readNotOnly") params.readOnly = false;
                if (!params && !params.contractNo) return;
                console.log("params",params)
                console.info(JSON.stringify(params))
                this.afs.newTab(
                    this,
                    "projects/basic/pages/contract/fee-waiver/cost-exempt-bill-detial/index",
                    "费用豁免单详情",
                    "ios-add",
                    params,
                    "cost-exempt-bill-detial-" + this.pageNo,
                    [],
                    true
                );
                this.pageNo += 1;
            },
        }
    }
</script>
<style>
    .export-btn {
        margin-bottom: 16px;
    }

    .contract-close-btns {
        padding-bottom: 28px;
        display: flex;
        flex-flow: row;
        justify-content: center;
        align-items: center;
    }
</style>
